import Address from './address.html';

import provinceTpl from './tpl/provinces.html';
import cityTpl from './tpl/city.html';
import regionsTpl from './tpl/regions.html';
import streetTpl from './tpl/street.html';
import Api from '../../api/Api.js';
import './address.scss';

import Util from '../util/util.js';

/**
 * Created with JetBrains WebStorm.
 * User: liyong.wang
 * Date: 2017/11/13
 * Time: 上午9:44
 * Desc: 地址选择弹窗封装
 * level可传入2，3，4 表示显示多少级选项
 * callback 确定按钮回调函数 返回组件对象 组件对象可以调用组件  show、hide、以及selected方法
 * 模拟数据来自平台500
 */
export default function ServiceArea(level,selectedCallback) {
    var _this = this;
    //缓存当前列表对象，本地搜索
    var provinceTemp = {},cityTemp = {},regionsTemp = {},streetTemp = {};
    var selectObj = {};
    this.init = function(){
        $('body').append(Address({}));
        switch (level){ //根据level判断显示几级地址
            case 2 :
                $(".provinces-wrapper").css({width:'50%'});
                $('.city-wrapper').css({width:'50%'});
                $('.regions-wrapper').hide();
                $('.street-wrapper').hide();
            break;
            case 3 :
                $(".provinces-wrapper").css({width:'33.3333%'});
                $('.city-wrapper').css({width:'33.3333%'});
                $('.regions-wrapper').css({width:'33.3333%'});
                $('.street-wrapper').hide();
            break;
            default : break;//默认4级
        }
    }
    // 查询省区域列表
    this.getProvince = function(){
        $.ajax({
            url: Api.getChildren,
            data:{pCode:0},
            type:'get',
            success:function(data){
                if(data && data.result){
                    $('.provinces-wrapper .opt-wrapper').html(provinceTpl({province:data.result}));
                    provinceTemp = data.result;
                }
            }
        });
    }

    this.init();
    this.getProvince();


    //根据省份id获取城市列表
    this.getCityByProvincesId = function(provincesId){
        $.ajax({
            url: Api.getChildren,
            type:'get',
            data:{pCode:provincesId},
            success:function(data){
                if(data && data.result){
                    $('.city-wrapper .opt-wrapper').html(cityTpl({city:data.result}));
                    cityTemp = data.result;
                }
            }
        });
    }
    //根据城市id查询区域列表
    this.getRegionsByCityId = function(cityId){
        $.ajax({
            url: Api.getChildren,
            type:'get',
            data:{pCode:cityId},
            success:function(data){
                if(data && data.result){
                    $('.regions-wrapper .opt-wrapper').html(regionsTpl({regions:data.result}));
                    regionsTemp = data.result;
                }
            }
        });
    }
    //根据区域id查询街道列表
    this.getStreetByRegionsId = function(regionsId){
       //TODO ajax
        $.ajax({
            url: Api.getChildren,
            type:'get',
            data:{pCode:regionsId},
            success:function(data){
                if(data && data.result){
                    $('.street-wrapper .opt-wrapper').html(streetTpl({street:data.result}));
                    streetTemp = data.result;
                }
            }
        });
    }

    //省列表点击事件
    $(".provinces-wrapper").on("click","li",function(e){
        $(".provinces-wrapper li").removeClass('active');
        $(this).addClass('active');
        var provincesSelect = $(this).data('select');
        _this.getCityByProvincesId(provincesSelect.code);
        selectObj.one = provincesSelect;
    });
    //城市列表点击事件
    $(".city-wrapper").on("click","li",function(e){
        $(".city-wrapper li").removeClass('active');
        $(this).addClass('active');
        var citySelect = $(this).data('select');
        _this.getRegionsByCityId(citySelect.code);
        selectObj.two = citySelect;
    });
    //区域列表点击事件
    $(".regions-wrapper").on("click","li",function(e){
        $(".regions-wrapper li").removeClass('active');
        $(this).addClass('active');
        var regionsSelect = $(this).data('select');
        _this.getStreetByRegionsId(regionsSelect.code);
        selectObj.three = regionsSelect;
    });
    //街道列表搜索事件
    $(".street-wrapper").on("click","li",function(e){
        $(".street-wrapper li").removeClass('active');
        $(this).addClass('active');
        var regionsSelect = $(this).data('select');
        selectObj.four = regionsSelect;
    });

    //省区域搜索事件
    $(".provinces-wrapper").on("keyup","input",function(e){
        var value = $(this).val();
        var filterTemp = provinceTemp;
        var searchResult = [];

        for(var i in filterTemp){
            if(filterTemp[i].name.indexOf(value) != -1){
                searchResult.push(filterTemp[i]);
            }
        }
        if(!searchResult.length || value==null || value == ""){
            searchResult = provinceTemp;
        }
        $('.provinces-wrapper .opt-wrapper').html(provinceTpl({province:searchResult}));
        $('.city-wrapper .opt-wrapper').html(cityTpl());
        $('.regions-wrapper .opt-wrapper').html(regionsTpl());
        $('.street-wrapper .opt-wrapper').html(streetTpl());
        selectObj = {};
    });
    //城市列表搜索事件
    $(".city-wrapper").on("keyup","input",function(e){
        var value = $(this).val();
        var filterTemp = cityTemp;
        var searchResult = [];

        for(var i in filterTemp){
            if(filterTemp[i].name.indexOf(value) != -1){
                searchResult.push(filterTemp[i]);
            }
        }
        if(!searchResult.length || value==null || value == ""){
            searchResult = cityTemp;
        }
        $('.city-wrapper .opt-wrapper').html(cityTpl({city:searchResult}));
        $('.regions-wrapper .opt-wrapper').html(regionsTpl());
        $('.street-wrapper .opt-wrapper').html(streetTpl());
        selectObj.two = null,selectObj.three = null,selectObj.four = null;
    });
    //区域列表搜索事件
    $(".regions-wrapper").on("keyup","input",function(e){
        var value = $(this).val();
        var filterTemp = regionsTemp;
        var searchResult = [];

        for(var i in filterTemp){
            if(filterTemp[i].name.indexOf(value) != -1){
                searchResult.push(filterTemp[i]);
            }
        }
        if(!searchResult.length || value==null || value == ""){
            searchResult = regionsTemp;
        }
        $('.regions-wrapper .opt-wrapper').html(regionsTpl({regions:searchResult}));
        $('.street-wrapper .opt-wrapper').html(streetTpl());
        selectObj.three = null,selectObj.four = null;
    });
    //街道列表搜索事件
    $(".street-wrapper").on("keyup","input",function(e){
        var value = $(this).val();
        var filterTemp = streetTemp;
        var searchResult = [];

        for(var i in filterTemp){
            if(filterTemp[i].name.indexOf(value) != -1){
                searchResult.push(filterTemp[i]);
            }
        }
        if(!searchResult.length || value==null || value == ""){
            searchResult = streetTemp;
        }
        $('.street-wrapper .opt-wrapper').html(streetTpl({street:searchResult}));
        selectObj.four = null;
    });

    //关闭弹窗事件
    $('.icon-shanchu,.cancel').on('click',function(){
        _this.close();
        _this.reset();
    });
    //确定按钮
    $('.address .confirm').on('click',function(){
         if (level == 2) {
             if (!selectObj.one) {
                 Util.alertMessage('请选择一级地址');
                 return;
             } else if (!selectObj.two) {
                 Util.alertMessage('请选择二级地址');
                 return;
             }
         }else if(level == 3) {
             if (!selectObj.one) {
                 Util.alertMessage('请选择一级地址');
                 return;
             } else if (!selectObj.two) {
                 Util.alertMessage('请选择二级地址');
                 return;
             } else if (!selectObj.three) {
                 Util.alertMessage('请选择三级地址');
                 return;
             }
         }else {
             if (!selectObj.one) {
                 Util.alertMessage('请选择一级地址');
                 return;
             } else if (!selectObj.two) {
                 Util.alertMessage('请选择二级地址');
                 return;
             } else if (!selectObj.three) {
                 Util.alertMessage('请选择三级地址');
                 return;
             } else if (!selectObj.four) {
                 Util.alertMessage('请选择四级地址');
                 return;
             }
         }
         if(selectedCallback){
             _this.close();
             selectedCallback(selectObj);
         }
    });
    //重置选择
    this.reset = function(){
        _this.getProvince();
        $('.input-wrapper-select input').val('');
        $(".provinces-wrapper li").removeClass('active');
        $('.city-wrapper .opt-wrapper').html(cityTpl());
        $('.regions-wrapper .opt-wrapper').html(regionsTpl());
        $('.street-wrapper .opt-wrapper').html(streetTpl());
        selectObj = {};
    }

    this.show = function(){
        $('.modal.address').show();
    }
    this.close = function(){
        $('.modal.address').hide();
        $('.modal.address').remove();
    }
    this.selected = function(){
        return selectObj;
    }


    return this;
}